<template>
  <z-paging
    class="content"
    :fixed="false"
    :auto="false"
    ref="paging"
    v-model="dataList"
    @query="queryList"
    :auto-clean-list-when-reload="false"
  >
    <Custom-refresh slot="refresher" slot-scope="{refresherStatus}" :status="refresherStatus"></Custom-refresh>
    <Custom-nomore slot="loadingMoreNoMore"></Custom-nomore>
    <!--#ifdef MP-WEIXIN||H5  -->
    <view class="content_postWrap" v-for="(item,index) in postList" :key="item._id">
      <PostItem :item="item"></PostItem>
    </view>
    <!-- #endif -->
    <!-- #ifdef APP-NVUE -->
    <cell class="content_postWrap" v-for="(item,index) in postList" :key="item._id">
      <PostItem :item="item"></PostItem>
    </cell>
    <!-- #endif -->
  </z-paging>
</template>

<script>
import ZPagingMixin from '@/uni_modules/z-paging/components/z-paging/js/z-paging-mixin'
import PostItem from './PostItem.vue'
export default {
  mixins: [ZPagingMixin],
  components: {
    PostItem
  },
  props: {
    catalog: {
      type: String,
      default: ''
    },
    sort: {
      type: String,
      default: 'created'
    },
    tabIndex: {
      type: Number,
      default: 0
    },
    currentIndex: {
      type: Number,
      default: 0
    }
  },
  data () {
    return {
      dataList: [],
      firstLoaded: false
    }
  },
  computed: {
    postList () {
      const postList = this.dataList.map(item => {
        switch (item.catalog) {
          case 'share':
            item.catalog = '分享'
            break
          case 'ask':
            item.catalog = '提问'
            break
          case 'notice':
            item.catalog = '公告'
            break
        }
        return item
      })
      return postList
    }
  },
  watch: {
    currentIndex: {
      handler (newVal) {
        if (newVal === this.tabIndex) {
          if (!this.firstLoaded) {
            setTimeout(() => {
              this.$refs.paging.reload();
            }, 10);
          }
        }
      },
      immediate: true
    },
    sort (n, o) {
      if (this.currentIndex === this.tabIndex) {
        this.sort = n
        this.$refs.paging.reload();
      }
    }
  },
  mounted () {
    uni.$on('reloadPost', this.isReload)
  },
  beforeDestroy () {
    uni.$off('reloadPost', this.isReload)
  },
  methods: {
    isReload (boolean) {
      if (boolean) {
        this.$refs.paging.reload()
      }
    },
    queryList (pageNo, pageSize) {
      uni.$axios.api.getPostList({
        catalog: this.catalog,
        sort: this.sort,
        page: pageNo - 1,
        limit: pageSize
      }).then(res => {
        if (res.code === 200) {
          this.$refs.paging.complete(res.data)
          this.firstLoaded = true
        }
      }).catch(res => {
        this.$refs.paging.complete(false);
      })
    },
    itemClick (id) {
      uni.navigateTo({
        url: `/subcom-home/PostDetail/PostDetail?tid=${id}`
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.content {
  /* #ifdef H5 || MP-WEIXIN */
  height: 100%;
  &_postWrap {
    width: 100%;
    box-sizing: border-box;
    padding: 10rpx 20rpx 0 20rpx;
  }
  /* #endif */
  /* #ifdef APP-NVUE */
  flex: 1;
  &_postWrap {
    padding: 10rpx 20rpx 0 20rpx;
  }
  /* #endif */
}
</style>
